<!DOCTYPE html>
<html  xmlns:th="http://www.w3.org/1999/xhtml">
<meta charset="utf-8">
<head th:include="include :: header">
    <!--追加样式-->
    <style>
        body {
            background-color: white;
        }

        .mui-content {
            background-color: white;
            height: 100%;
        }

        .mui-media-body p {
            padding-left: 8px;
        }

        ul {
            padding: 0;
            margin: 0;
        }

        /*li{text-decoration: none;list-style: none;border-bottom : 1px solid #ccc;margin-top: 1px;width: 100%;
        height: 40px;line-height: 40px;
         padding-left: 8px;
        }*/
        .mui-content {
            height: 1000px;
        }
    </style>
</head>


<body>
<header class="mui-bar mui-bar-nav">
    <a href="/iphone/stack" class="mui-icon mui-pull-left"><span style="font-size: 15px">返回</span></a>
    <h1 class="mui-title">图书列表</h1>
</header>
<div class="mui-content">
    <form method="post" action="/iphone/search">
        <div class="mui-input-row ">
            <input type="search" placeholder="书名" name="bookName" style="float: left;width: 75%;margin:10px">

            <button class="inline-block" style="width: 55px;height: 30px;margin-left: 10px;margin-top: 10px">搜索</button>

        </div>
    </form>
    <!--贡献过的图书列表-->
    <!--每本书都连接到图书详情-->
    <div class="mui-row">
        <ul class="mui-table-view">
            <li class="mui-table-view-cell mui-media" th:each="search:${results}">
                <a th:href="'/iphone/bookinfo/'+${search.id}" style="height: 85px;">
                    <img class="mui-pull-left"
                         th:src="${search.book_img}" style="max-height: 100%;width: 80px;height: 100px;" />
                    <div class="mui-media-body">
                        <div class="mui-ellipsis" th:text="${search.book_name}"
                             style=" color: #000000;padding-left: 5px;margin-top: 8px;font-size: 15px">书名
                        </div>
                        <p style=" color: #8F8F94;font-size: 12px ;" th:text="${search.author2}">作者</p>
                    </div>
                </a>
            </li>
            <li class="mui-table-view-cell mui-media" th:attr="hidden=(${results==null}?false:ture)">
                <a style="height: 85px;">
                    <div class="item">
                        <div class="content">
                            没有搜到图书
                        </div>
                    </div>
                </a>
            </li>
        </ul>
    </div>
</div>
<div th:include="include :: footer"></div>
</body>


<!--<script type="text/javascript">
    mui.init()
</script>-->

</html>